<div class="main-container">
    <div class="report-select-bar">
        <nz-radio-group [(ngModel)]="type"
                        (ngModelChange)="reportTypeChanged($event)"
                        [nzButtonStyle]="'solid'">
            <label nz-radio-button
                   *ngFor="let option of reportTypeSelections"
                   [nzValue]="option.value">
                {{ option.label }}
            </label>
        </nz-radio-group>
    </div>

    <div class="report-table-wrap">
        <nz-table #dataTable
                  class="main-table"
                  nzBordered
                  [nzData]="tableData"
                  nzSize="middle"
                  [nzFrontPagination]="false">
            <thead>
            <tr class="custom-head">
                <ng-container *ngIf="type === 0">
                    <th>报送内容</th>
                    <th>报送频次</th>
                    <th>上报时段</th>
                    <th>报送进度</th>
                </ng-container>
                <ng-container *ngIf="type === 1">
                    <th>发布内容</th>
                    <th>发布频次</th>
                    <th>发布时段</th>
                    <th>发布状态</th>
                </ng-container>
                <ng-container *ngIf="type === 2">
                    <th>报送内容</th>
                    <th>报送频次</th>
                    <th>上报时段</th>
                    <th>报送进度</th>
                </ng-container>
                <th>操作</th>
            </tr>
            </thead>
            <tbody>
            <tr *ngFor="let data of dataTable.data;let idx = index" [class]="{'even':idx % 2 === 1, 'green': data.isFinish, 'red': !data.isFinish}">
                <ng-container *ngIf="type === 0">
                    <td>{{data.name}}</td>
                    <td>{{ data.frequency }}</td>
                    <td>{{data.time}}</td>
                    <td *ngIf="mngType === 0">
                        <a (click)="directToOverview()">{{data.progress}}</a>
                    </td>
                    <td *ngIf="mngType === 1">{{ mngReportStatus[data.statu] }}</td>
                </ng-container>
                <ng-container *ngIf="type === 1">
                    <td></td>
                    <td></td>
                    <td></td>
                </ng-container>
                <ng-container *ngIf="type === 2">
                    <td>{{data.name}}</td>
                    <td>{{ data.frequency }}</td>
                    <td>{{data.time}}</td>
                    <td *ngIf="mngType === 0">{{data.progress}}</td>
                    <td *ngIf="mngType === 1">{{ mngPlanStatus[data.qty] }}</td>
                </ng-container>
                <td *ngIf="mngType === 0">
                    <a (click)="broadcast(data)">一键催报</a>
                </td>
                <td *ngIf="mngType === 1">
                    <a (click)="redirected()">填报页面</a>
                </td>
            </tr>
            </tbody>
        </nz-table>
    </div>
</div>
